<script type="text/javascript">
var enable_submit=true;
function submit_volume_copy(){
    var modal_selector = $("#volume_copy");
    var clone_volume_name = modal_selector.find("#clone_volume_name");
    var target_tier = modal_selector.find("#volume_tt_select");
 	var bValid = true;
    var pool_dropdown = modal_selector.find("#volume_pool_cr");
    bValid = bValid && checkLength(clone_volume_name, "名称", 1, 32 );
    bValid = bValid && checkRegexp(clone_volume_name, /^[0-9a-z-]+$/, "名称应由小写英文字母、数字或中划线(英文)构成。");

    if (bValid) {
        if(enable_submit){
            enable_submit=false;
            var $submitBtn = $('.modal-footer').find('.btn-blue');
            $submitBtn.html('<i class="fa fa-spinner fa-spin" style="margin:3px 6px;"></i>');
            $('.rtn-tip').slideUp('fast');
            $.post("/volume/copy",{
                "tgt_volume" : clone_volume_name.val(),    
                "pool_id": $.trim(pool_dropdown.attr('realvalue')),
                "volume_id": "{{volume.id}}",
                "owner": "{{volume.username}}",
                "priority": $.trim(target_tier.attr("realvalue"))
            },
            function(data){
                if (data.reply.is_success){
                    angular.element('#volume_controller').scope().close();
                    $('#volume_available_tb').trigger("reloadGrid")
                }else{
                    error =  data.reply.error;
                    $('.rtn-tip').text(error).slideDown('fast');
                    $submitBtn.html(SelfTranslate("[[ 'label ok'|translate ]]"));
                    enable_submit=true;
                }
            });
        }
    }
}
$(function() {
    var volume_pool = new Array();
    {% for pool in pools %}
        var values = new Array();
        values[0] = "{{pool.id}}";
        values[1] = "{{pool.path}}";
        volume_pool.push(values);
    {% endfor %}
    $('#volume_copy #volume_pool_cr').rqDropDown({
        "datatype":"local",
        "source":volume_pool,
        position:true       
    });

    $('#volume_copy #volume_tt_select').rqDropDown({
        "datatype":"local",
        "source":get_tiers(),
        position:true
    });

    /* 为小图标绑定鼠标移入移出事件 */
    var obj = {
        "clone_volume_name":"由1到32位小写英文字母、数字、中划线(英文)构成。"
    }
    bindMouseEvent('#volume_copy',obj);
    /* 为小图标绑定鼠标移入移出事件结束 */
});
</script>
<div class="modal-header">  
    <h3>卷拷贝</h3>  
</div> 
<div  class="modal-body modal-body-height"  id="volume_copy">

<div class="volume-copy-box">
<div class="rtn-tip"></div>
<table class="base-info">
    <tr>
        <td>
            <label>名称</label><a>*</a>
        </td>
        <td colspan="3">
            <input id="clone_volume_name" name="clone_volume_name" size="25" type="text"/>
            <i class="fa fa-question-circle" itype="clone_volume_name"></i>
        </td>
    </tr>
    <tr>
        <td>
            <label>存储池</label><a>*</a>
        </td>
        <td>
            <input id="volume_pool_cr" readonly="readonly" class="rounded_dropdown" value='{{pool.path}}' realvalue="{{pool.id}}"/>
        </td>
        <td>
            <label>目标分层</label><a>*</a>
        </td>
        <td>
            <input id="volume_tt_select" readonly="readonly" class="rounded_dropdown" value="[['{{volume.priority}}'|translate]]" realvalue="{{volume.priority}}"/>
        </td>
    </tr>
</table>
</div>
<div class="error-tip">
    <p></p><span></span>
</div>
<div class="tip">
    <p></p><span></span>
</div>
</div>
<div class="modal-footer">  
    <button class="btn btn-blue" ng-click="volume_copy()">[[ 'label ok'|translate ]]</button>  
    <button class="btn btn-white" ng-click="cancel()">[[ 'label cancel'|translate ]]</button>  
</div>
